<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core" xmlns:p="http://primefaces.org/ui">

<head></head>
<f:view>
	<ui:composition template="layout/layout.xhtml">
		<ui:define name="body" styleClass="todo">

			<h:form enctype="multipart/form-data" id="adminForm" rendered="#{loginBean.usuarioLogueado}">

				<p:growl id="messages" showDetail="true" sticky="true" />
				<p:panel header="Datos de la empresa">
					<h:panelGrid columns="2">
						<h:panelGrid columns="2" columnClasses="column">
							<h:panelGrid columns="2">
								<h:outputText value="Nombre de la empresa:" />
								<p:inplace id="ajaxInplace" editor="true">
									<p:inputText value="#{adminBean.empresa.nombre}" />
								</p:inplace>

								<h:outputText value="Fecha de Ingreso:" />
								<p:inplace disabled="true" editor="true">
									<p:calendar value="#{adminBean.empresa.fechaCreacion}" readonly="true" id="popupButtonCal" showOn="button">
										<f:convertDateTime pattern="dd/MM/yyyy" />
									</p:calendar>

								</p:inplace>


								<h:outputText value="Cupo de Usuarios de la empresa:" />
								<p:inplace disabled="true" editor="true">
									<p:calendar value="#{adminBean.empresa.cantidadUsuarios}" readonly="true" showOn="button" />
								</p:inplace>

								<h:outputText value="Cantidad de usuarios ingresados:" />
								<p:inplace disabled="true" editor="true">
									<p:calendar value="#{adminBean.cantidadUsuarios}" readonly="true" showOn="button" />
								</p:inplace>
							</h:panelGrid>
						</h:panelGrid>

						<h:panelGrid columns="1">

							<p:graphicImage value="/resources/imagenes/empresa/#{adminBean.empresa.logo}" id="imagen" style="width:160px" />
							<p:fileUpload id="empresaFileUpload" fileUploadListener="#{adminBean.subirImagenEmpresa}" multiple="false" auto="true" update="imagen"
								label="Subir Logo" sizeLimit="1048576" allowTypes="/(\.|\/)(gif|jpe?g|png)$/" invalidSizeMessage="Tamaño máximo 1 MB !"
								invalidFileMessage="Solo se pueden subir imágenes !" rendered="true" />

						</h:panelGrid>
					</h:panelGrid>

					<p:commandButton value="#{msg.titulo_guardar}" partialSubmit="true" ajax="false" action="#{adminBean.guardarEmpresa}" update="adminForm" />
				</p:panel>

			</h:form>

			<h:form id="areaTrabajoForm">

				<p:dataTable id="areaTrabajoDT" var="areaTrabajo" value="#{adminBean.areasTrabajo}" rowKey="#{areaTrabajo.idAreaDeTrabajo}"
					selection="#{adminBean.areaTrabajoSelected}" selectionMode="single">

					<p:column headerText="Id" styleClass="column25">
						<h:outputText value="#{areaTrabajo.idAreaDeTrabajo}" />
					</p:column>

					<p:column headerText="Nombre" styleClass="column25">
						<h:outputText value="#{areaTrabajo.nombre}" />
					</p:column>

					<p:column headerText="Descripción" style="word-wrap: break-word;">
						<h:outputText value="#{areaTrabajo.descripcionCorta}" />
					</p:column>

					<p:column headerText="Fecha Creación" styleClass="column25">
						<h:outputText value="#{areaTrabajo.fechaCreacion}">
							<f:convertDateTime pattern="dd/MM/yyyy" />
						</h:outputText>
					</p:column>

					<f:facet name="footer">
						<p:commandButton id="viewButton" value="Editar" icon="ui-icon-search" update=":frmAreaTrabajoDlg:display" oncomplete="areaTrabajoDialog.show()">

						</p:commandButton>
					</f:facet>

				</p:dataTable>
			</h:form>

			<h:form id="nuevaAreaTrabajoForm">

				<p:panel id="uno" header="Ingresar Nueva Area de Trabajo">
					<p:messages id="msgsNuevaAreaTrabajoFrm" showDetail="true" />
					<p:panelGrid id="dos" columns="2">
						<p:panelGrid id="tres" columns="2">

							<p:outputLabel value="#{msg.campo_requerido} #{msg.titulo_nombre} #{msg.dos_puntos}" />
							<p:inputText id="titulo" value="#{adminBean.nuevaArea.nombre}" styleClass="tamanio100" required="true" label="#{msg.titulo_nombre}" />

							<p:outputLabel styleClass="tareaForm" value="#{msg.campo_requerido} #{msg.titulo_descripcion} #{msg.dos_puntos}" />
							<p:inputTextarea id="descripcion" value="#{adminBean.nuevaArea.descripcion}" styleClass="textBoxArea" required="true"
								label="#{msg.titulo_descripcion}"></p:inputTextarea>

							<p:outputLabel styleClass="tareaForm" value="#{msg.campo_requerido} Asignar Grupo Usuario #{msg.dos_puntos}" />

							<p:panelGrid id="cuatro" columns="2">
								<p:selectOneMenu id="grupoUsuarioSelectOneMenu" required="true" value="#{adminBean.grupoUsuarioSelecItem}" panelStyle="width:250px"
									style="width:260px">
									<f:selectItem itemLabel="Seleccione" itemValue="" />
									<f:selectItems value="#{adminBean.selectItemsGrupoUsuarios}" required="true" />
									<!-- 									<p:ajax immediate="true" /> -->
								</p:selectOneMenu>

								<p:commandButton immediate="true" icon="ui-icon-plusthick" oncomplete="nuevoGrupoDialog.show()" />
							</p:panelGrid>
						</p:panelGrid>

						<h:panelGrid columns="1" columnClasses="column">

							<p:graphicImage width="150" value="#{adminBean.nuevaArea.imagen}" id="imagenAreaTrabajo" />
							<p:fileUpload id="areaTrabajoFileUpload" fileUploadListener="#{adminBean.subirImagenAreaTrabaja}" multiple="false" auto="true"
								update="imagenAreaTrabajo" label="Subir Logo" sizeLimit="1048576" allowTypes="/(\.|\/)(gif|jpe?g|png)$/"
								invalidSizeMessage="Tamaño máximo 1 MB !" invalidFileMessage="Solo se pueden subir imágenes !" rendered="true" />

						</h:panelGrid>
					</p:panelGrid>

					<p:commandButton value="#{msg.titulo_guardar}" immediate="true" ajax="false" action="#{adminBean.guardarAreaTrabajo}" />

				</p:panel>
			</h:form>


			<p:dialog id="areaTrabajoDlg" header="Area Trabajo" widgetVar="areaTrabajoDialog" resizable="false" appendToBody="true" width="800" height="600"
				modal="true">
				<h:form id="frmAreaTrabajoDlg">
					<h:panelGrid id="display" columns="2">
						<f:facet name="header">
							<p:graphicImage value="#{adminBean.areaTrabajoSelected.imagen}" />
						</f:facet>

						<h:outputText value="Nombre:" />
						<p:inplace editor="true">
							<p:inputText value="#{adminBean.areaTrabajoSelected.nombre}" />
						</p:inplace>

						<h:outputText value="Descripción:" />
						<p:inputTextarea style="width : 400px" maxlength="255" value="#{adminBean.areaTrabajoSelected.descripcion}" required="true">
							<p:ajax event="change" />
						</p:inputTextarea>


					</h:panelGrid>

					<!-- 					<f:facet name="footer"> -->
					<p:commandButton value="Modificar Datos" icon="ui-icon-disk" actionListener="#{adminBean.actualizarAreaTrabajo}" immediate="true" ajax="false"
						update=":areaTrabajoForm:areaTrabajoDT" />
					<!-- 					</f:facet> -->
				</h:form>
			</p:dialog>



			<p:dialog id="nuevoGrupo" header="Alta Grupo" widgetVar="nuevoGrupoDialog" resizable="false" appendToBody="true" width="800" height="600"
				modal="true">
				<h:form>
					<p:messages id="msgsGrupoUsuarioFrm" />
					<p:panel header="Datos Del Grupo">
						<h:panelGrid columns="2">
							<h:outputLabel value="*Nombre del Grupo:" />
							<h:inputText id="descGrupoUsuario" required="true" value="#{adminBean.nuevoGrupoUsuario.descripcion}" label="Nombre del Grupo" />

							<h:outputLabel value="*Seleccione Coordinador:" />
							<p:selectOneMenu value="#{adminBean.coordinadorSelecItem}" label="Seleccione Coordinador" required="true" panelStyle="width:250px"
								style="width:260px">
								<f:selectItem itemLabel="Seleccione" itemValue="" />
								<f:selectItems value="#{adminBean.selectItemsUsuarios}" />
								<p:ajax immediate="true" />
							</p:selectOneMenu>
						</h:panelGrid>
					</p:panel>

					<p:panel header="Personal del grupo">

						<p:pickList id="pojoPickList" value="#{adminBean.lstUsuarios}" var="usuario" effect="bounce" itemValue="#{usuario}"
							itemLabel="#{usuario.idUsuario}" converter="usuarioConverter" showSourceControls="true" showTargetControls="true" showCheckbox="true"
							showSourceFilter="true" showTargetFilter="true" filterMatchMode="contains">

							<f:facet name="sourceCaption">Disponible</f:facet>
							<f:facet name="targetCaption">En el grupo</f:facet>

							<p:ajax event="transfer" listener="#{adminBean.onTransfer}" />

							<p:column style="width:25%">
								<p:graphicImage value="#{usuario.imagen}" width="30" height="40" />
							</p:column>

							<p:column style="width:75%;">  
            					#{usuario.nombres} , #{usuario.apellidos} 
        					</p:column>

						</p:pickList>
					</p:panel>

					<p:commandButton value="#{msg.titulo_guardar}" icon="ui-icon-disk" action="#{adminBean.guardarGrupo}" update="msgsGrupoUsuarioFrm"
						immediate="true" />
				</h:form>
			</p:dialog>




		</ui:define>
	</ui:composition>
</f:view>

</html>